<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="layui/css/layui.css" rel="stylesheet">
    <script src="layui/layui.js"></script>
    <style type="text/css">
        .layui-form-item{
            width: 700px;
        }
        .
    </style>
</head>
<body>

<form id="toAddFatherPlate" lay-filter="toAddFatherPlate"
      class="layui-form layui-form-pane"
      style="margin: 30px auto; display: inline-block;" >
    <div class="layui-form-item" style="text-align: center;">
        <label class="layui-form-label layui-bg-gray" style="width: 200px; margin-left: 120px">版块Id</label>
        <div class="layui-input-inline" style="width: 300px">
            <input type="text" lay-verify="required"
                   autocomplete="off" placeholder="版块Id" class="layui-input" name="plateId">
        </div>
    </div>
    <div class="layui-form-item" style="text-align: center;">
        <label class="layui-form-label layui-bg-gray" style=" width: 200px; margin-left: 120px;">板块名称</label>
        <div class="layui-input-inline" style="width: 300px">
            <input type="text" lay-verify="required" name="plateName"
                   autocomplete="off" placeholder="板块名称 " class="layui-input"
                   onkeyup="value=value.replace(/[\d]/g,'') "
                   onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[\d]/g,''))">
        </div>
    </div>
    <div class="layui-form-item" style="text-align: center;">
        <label class="layui-form-label layui-bg-gray" style="width: 200px; margin-left: 120px">备注</label>
        <div class="layui-input-inline" style="width: 300px">
            <input type="text" lay-verify="required"
                   autocomplete="off" placeholder="备注" class="layui-input" name="plateRemark">
        </div>
    </div>
    <div class="layui-form-item" style="position: absolute;left: 28%; bottom: 20px">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="addFatherPlate"><i class="layui-icon">&#x1005;</i>添加</button>
            <button type="reset" class="layui-btn layui-btn-primary"> <i class="layui-icon">&#x1006;</i>取消</button>
        </div>
    </div>
</form>

<script type="text/javascript">
    layui.use('form',function (){
        var form = layui.form;
        var $ = layui.jquery;

        form.on('submit(toAddFatherPlate)',function(obj){
            var data = form.val("toAddFatherPlate");

            $.post("insertFatherPlate",data,function (msg) {
                console.log(msg)
            });
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });
    })
</script>
</body>
</html>